<template>
  <div>
    <el-dialog :visible.sync="coSelectVisible" :append-to-body="true">
      <div class="panelWrap co-wrap">

        <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
          <div>{{ title }}查询</div>
          <i class="el-icon-close" @click="handleCloseDialogUpdate" />
        </div>
        <div class="coSelect-dialog m-t-20 m-b-20">
          <div class="flex flexac m-l-15">
            <el-input v-model="queryParam.name" class="co-input m-l-10" placeholder="请输入名称" @keyup.enter.native="getOrg" @input="handleSearch" />
            <el-button class="searchBtn co-btn flex flexac m-l-20 m-r-20" size="small" type="warning" @click="getOrg"><i class="co-i" /><span class="search1">查 询</span></el-button>
            <el-button class="defaultbtn co-btn saveBtn m-l-10 el-icon-success" @click="handleSelectSave">选 中</el-button>
          </div>
          <el-table
            ref="multipleTable"
            class="m-t-30 con-table m-b-25"
            type="expand"
            :data="dataList"
            highlight-current-row
            @select-all="handleCheck"
            @select="handleCheck"
            @selection-change="handleCheckChange"
            @row-dblclick="dbSelected"
          >
            <el-table-column type="selection" align="center" width="55" height="40" />
            <template v-for="item in tablehead">
              {{ item }}
              <el-table-column :key="item.index" align="center" :prop="item.prop" :label="item.label" />
            </template>
          </el-table>
        </div>
        <el-pagination
          class="paginationWrap co-page flex m-l-10"
          :current-page="paging.currentPage"
          :page-sizes="paging.pageSizeArr"
          :page-size="paging.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="paging.total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { fetchFtpList } from '@/api/operation/BOM/opStock'
import { elevatorQueryList } from '@/api/elevator/elevator'
import { fetchStockOutList } from '@/api/operation/BOM/opStockOut'
import { fetchProList } from '@/api/operation/BOM/opBomProduct'
import { fetchEquiList } from '@/api/operation/BOM/opBomEquipment'
import { fetchComList } from '@/api/operation/BOM/opBomCompany'
import { fetchEntList } from '@/api/operation/ent'
// import { fetchCompanies } from '@/api/baseInfo/authority/company'
// import { fetchOrgList } from '@/api/authority/org'
// import { fetchUserCompany } from '@/api/authority/user'

import { showNotice } from '@/utils/toolclass'

export default {
  name: 'PubSelect',
  props: {
    stockType: Number,
    showNature: {
      type: Boolean,
      default: false
    }, // 只展示成品列表
    selectType: Number, // 弹出框类型
    title: String, // 弹出框标题
    value: {
      type: Boolean,
      default: false
    },
    queryParam: {
      type: Object,
      default: () => ({
        id: '',
        name: ''
      })
    },
    coType: {
      type: Number,
      default: null
    }
  },
  data() {
    return {
      ciruitFn: null,
      row: {},
      coSelectVisible: false,
      dataList: [],
      paging: {
        currentPage: 1,
        pageSize: 4,
        pageSizeArr: [4, 8, 10, 14],
        total: 4
      }

    }
  },
  computed: {
    tablehead() {
      switch (this.selectType) {
        case 0:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'name',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 1:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'name',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 2:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'entName',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 3:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'equipmentName',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 4:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'installAddress',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 5:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'equipmentName',
              label: '名称',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        case 6:
          return [
            {
              index: 0,
              prop: 'id',
              label: `ftpID`,
              sortable: false,
              fixed: true,
              isShow: true
            },
            {
              index: 1,
              prop: 'ftpAccount',
              label: 'ftp账号',
              sortable: false,
              fixed: true,
              isShow: true
            }
          ]
          break
        default:
          break
      }
    }
  },
  watch: {
    async selectType(newVal, oldVal) {
      this.getCoSelectList()
    },
    coSelectVisible(v) {
      this.$emit('input', v)
    },
    value(v) {
      this.coSelectVisible = v
    }
  },
  async mounted() {
    console.log(this.$props)
    this.getCoSelectList()
  },
  methods: {
    // 单选操作，全选按钮失效操作
    handleCheck(selection, row) {
      this.$refs.multipleTable.clearSelection()
      if (selection.length === 0) { // 判断selection是否有值存在
        return
      }
      if (row) {
        this.selectioned = row
        this.row = row
        this.$refs.multipleTable.toggleRowSelection(row, true)
      }
    },

    // 取消单选的checkbox
    handleCheckChange(row) {
      if (row.length === 0) {
        this.selectioned = null
      }
    },
    dbSelected(row) {
      this.$emit('update', row)
      // showNotice('success', '提示', '保存成功!')
      this.$emit('handleRefresh')
      this.$emit('handleCloseDialog')
      this.coSelectVisible = false
    },
    handleSelectSave() {
      if (!this.selectioned) {
        showNotice('error', '提示', '请选择公司')
      } else {
        this.$emit('update', this.row)
        this.$emit('handleRefresh')
        this.$emit('handleCloseDialog')
        this.coSelectVisible = false
      }
    },
    handleSizeChange(val) {
      this.paging.pageSize = val
      this.getCoSelectList()
    },
    handleCurrentChange(val) {
      console.log(val)
      this.paging.currentPage = val
      this.getCoSelectList()
    },
    // 模糊查询
    getOrg() {
      switch (this.selectType) {
        case 0:
          this.ciruitFn = fetchComList
          break
        case 1:
          this.ciruitFn = fetchEquiList
          break
        case 2:
          this.ciruitFn = fetchEntList
          break
        case 3:
          this.ciruitFn = fetchStockOutList
          break
        case 4:
          this.ciruitFn = elevatorQueryList
          break
        case 5: //获取产品ID
          this.ciruitFn = fetchProList
        case 6: //获取FTP（配置列表）
          this.ciruitFn = fetchFtpList
        default:
          break
      }
      const params = {
        id: this.queryParam.id,
        name: this.queryParam.name,
        pageIndex: this.paging.currentPage,
        pageSize: this.paging.pageSize
      }
      if (this.selectType == 2) {
        params.type = this.stockType || ''
      }
      if (this.selectType == 4) {
        this.ciruitFn(3,'','',params.pageIndex, params.pageSize).then(res => {
          if (this.showNature && this.selectType == 1) {
            this.dataList = res.data ? res.data.filter(item => {
              if (item.nature == '成品') {
                return this.dataList.push(item)
              }
            }) : []
          } else {
            this.dataList = res.data ? res.data : []
          }

          const i = this.dataList.map(item => item)
          this.paging.total = res.pager.totalSize
        })
      } else {
        this.ciruitFn(params).then(res => {
          if (this.showNature && this.selectType == 1) {
            this.dataList = res.data.filter(item => {
              if (item.name.toLowerCase().indexOf(this.queryParam.name > -1 && item.nature == '成品')) {
                return this.dataList.push(item)
              }
            })
            
          } else {
            //获取出库单设备列表
            this.dataList = res.data.filter(item => {
              if (item.equipmentName.toLowerCase().indexOf(this.queryParam.name) > -1) {
                return this.dataList.push(item)
              }
            })
          }
          this.handleSearch(this.dataList)
        })
      }
    },
    handleSearch(companyName) {
      if (this.queryParam.companyName === '') {
        this.getCoSelectList()
      }
    },
    getCoSelectList() {
      switch (this.selectType) {
        case 0: //获取厂家ID
          this.ciruitFn = fetchComList
          break
        case 1: //获取设备ID
          this.ciruitFn = fetchEquiList
          break
        case 2: //获取往来单位ID
          this.ciruitFn = fetchEntList
          break
        case 3: //获取出库ID
          this.ciruitFn = fetchStockOutList
          break
        case 4: //获取电梯ID
          this.ciruitFn = elevatorQueryList
          break
        case 5: //获取产品ID
          this.ciruitFn = fetchProList
          break
        case 6: //获取FTP（配置列表）
          this.ciruitFn = fetchFtpList
          break
        default:
          break
      }

      const params = {
        pageIndex: this.paging.currentPage,
        pageSize: this.paging.pageSize
      }
      if (this.selectType == 2) {
        params.type = this.stockType || ''
      }
      if (this.selectType == 4) {
        this.ciruitFn(3, '','', params.pageIndex, params.pageSize).then(res => {
          if (this.showNature && this.selectType == 1) {
            this.dataList = res.data ? res.data.filter(item => {
              if (item.nature == '成品') {
                return this.dataList.push(item)
              }
            }) : []
          } else {
            this.dataList = res.data ? res.data : []
          }

          const i = this.dataList.map(item => item)
          this.paging.total = res.pager.totalSize
        })
      } else {
        params.isProduct = 1;
        this.ciruitFn(params).then(res => {
          if (this.showNature && this.selectType == 5) {
            this.dataList = res.data ? res.data.filter(item => item.nature == '成品') : []
          } else {
            this.dataList = res.data ? res.data : []
          }

          const i = this.dataList.map(item => item)
          this.paging.total = res.pager.totalSize
        })
      }
    },
    handleCloseDialogUpdate() {
      this.coSelectVisible = false
    }
  }

}
</script>

<style lang="scss">
.el-dialog {
  width: 500px;
}
.el-dialog__headerbtn {
  display: none;
}
.el-dialog__header {
  padding: 0;
}
.el-dialog__body {
  padding: 0;
}
  .co-btn {
    height: 40px;
  }
  .search1 {
    vertical-align: middle;
    font-size: 14px;
  }
  .co-input {
    width: 240px;
  }
</style>

<style lang="scss" scoped>
.co-wrap {
  position: relative;
  .co-page {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
.panelWrap {
  width: 600px;
  height: 460px;
  background: #ffffff;
  .el-icon-success:before {
    margin-right: 4px;
  }

  .searchBtn {}
}

</style>
